<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>隔行换色</title>
    //
<script>
    onload=function () {
        //获取所有的tr
       var trarr=document.getElementsByTagName("tr");
        //2 判断哪些是奇数哪些是偶数
        for (var i=0;i<trarr.length;i++){
            if (i%2==0){
                trarr[i].style.backgroundColor="blue";
            }else{
                trarr[i].style.backgroundColor="red";
            }
            //设置鼠标移入跟移出事件
            trarr[i].onmousemove=function () {
                this.style.backgroundColor="green";
            }
            //鼠标移除换色
            trarr[i].onmouseout=function () {
                this.style.backgroundColor="red";
            }


        }
    }
</script>
</head>
<body>
<table  >
    <tr>
        <th>分类ID</th>
        <th>分类名称</th>
        <th>分类描述</th>
        <th>操作</th>
    </tr>
    <tr>
        <th>1</th>
        <th>手机数码</th>
        <th>手机数码商品</th>
        <th><a href="">修改</a>|<a href="#">删除</a> </th>
    </tr>
    <tr>
        <th>2</th>
        <th>电脑办公</th>
        <th>电脑办公商品</th>
        <th><a href="">修改</a>|<a href="#">删除</a> </th>
    </tr>
    <tr>
        <th>3</th>
        <th>鞋靴商品</th>
        <th>鞋靴类商品</th>
        <th><a href="">修改</a>|<a href="#">删除</a> </th>
    </tr>
    <tr>
        <th>4</th>
        <th>家具饰品</th>
        <th>家具类商品</th>
        <th><a href="">修改</a>|<a href="#">删除</a> </th>
    </tr>
</table>

</body>
</html>